<!-- chongzhi.jsp -->
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>话费充值</title>
  <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
</head>
<body>
<div class="container">
  <!-- 导航栏 -->
  <nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav">
        <li class="nav-item">
          <a class="nav-link" href="main.jsp">返回主页</a>
        </li>
      </ul>
    </div>
  </nav>

  <div class="row mt-5">
    <div class="col-md-6 offset-md-3">
      <div class="card">
        <div class="card-header bg-primary text-white">
          <h3 class="card-title">话费充值</h3>
        </div>
        <div class="card-body">
          <!-- 充值成功提示 -->
          <c:if test="${not empty msg}">
            <div class="alert ${success ? 'alert-success' : 'alert-danger'} alert-dismissible fade show" role="alert">
                ${msg}
              <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
          </c:if>

          <form action="chongzhi" method="post">
            <div class="form-group">
              <label for="cardNumber">卡号</label>
              <input type="text" class="form-control" id="cardNumber" name="cardNumber"
                     placeholder="请输入您的卡号" required>
            </div>

            <div class="form-group">
              <label for="rechargeAmount">充值金额</label>
              <div class="input-group">
                <div class="input-group-prepend">
                  <span class="input-group-text">¥</span>
                </div>
                <input type="number" class="form-control" id="rechargeAmount" name="rechargeAmount"
                       min="50" step="10" placeholder="最少充值50元" required>
                <div class="input-group-append">
                  <span class="input-group-text">.00</span>
                </div>
              </div>
              <small class="form-text text-muted">充值金额必须为50元或以上</small>
            </div>

            <button type="submit" class="btn btn-primary btn-block">确认充值</button>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>

<script src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>